import React from 'react'
import { Tools } from 'weaver-mobile'
import { withRouter } from 'react-router-dom'

const getLabel = Tools.getLabel

@withRouter
class Wrttag extends React.PureComponent {

  constructor(props) {
    super(props)
    this.state = { ...props }
  }

  componentWillMount() {

  }

  render() {
    const { bgcolor = "#333", fontcolor = "#fff", fontsize = 12, radius = 14, autoAdapt = true,
      width = 50, height = 20, paddingTopBottom = 8, paddingLeftRight = 16, lable = "" } = this.state

    return (
      <div
        className="workrelate-mobile-tag"
        style={{
          width: autoAdapt ? "auto" : width,
          height: autoAdapt ? "auto" : height,
          // paddingTop: paddingTopBottom,
          // paddingBottom: paddingTopBottom,
          paddingLeft: paddingLeftRight,
          paddingRight: paddingLeftRight,
          borderRadius: radius,
          fontSize: fontsize,
          backgroundColor: bgcolor,
          color: fontcolor
        }}
      >
        <div 
          className="content"
          style={{
            height,
            lineHeight: height + "px"
          }}
        >
          {lable}
        </div>
      </div>
    )
  }
}

export default Wrttag